// hooks通常名字取名成useXxx.js

import {reactive,onMounted,onUnmounted} from 'vue'
// 暴露1个方法，外面可以很轻易的调用
export default function(){
  const point = reactive({
    x:0,
    y:0,
  })
  function clickEvent(event){
      point.x=event.pageX
      point.y=event.pageY
  }
  onMounted(() => {
    window.addEventListener('click', clickEvent)
  });
  onUnmounted(() => {
    window.removeEventListener('click', clickEvent)
  });
  return point
}
// 所谓hooks就是抽取公共的部分，且这部分包括组合式api(ref, reactive)，形成一个公共的可调用的方法